<template>
<div>
  <input v-model="hobby" type="checkbox" value="抽烟">抽烟<br>
  <input v-model="hobby" type="checkbox" value="喝酒">喝酒<br>
  <input v-model="hobby" type="checkbox"  value="烫头">烫头<br>
   你选择的是:{{hobby}}
  <br>
  <button @click="change">点击切换</button><br>
  <span v-if="flag"> 你好 vue </span>
  <span v-if="!flag">你好 王二</span>


</div>
</template>

<script>
export default {
  name: "User2View",
  data(){
    return{
      hobby:[],
      flag:true,

    }
  },methods:{

    change(){
      this.flag=!this.flag
    }

  },beforeCreate() {
    console.log("1 beforeCreate")
  },created() {
    console.log("2 created ")
  },beforeMount() {
    console.log("3 beforeMount")
  }
}
</script>

<style scoped>

</style>